<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div id="app">
         <div v-for="(item,index) in arr">
             {{item}}:<input type="checkbox" v-model="vals" :value="index">
         </div>
         <div>
            <button>提交</button>
         </div>
         {{vals}}
    </div>
    <script src='https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.js'></script>
    <script>
        //争对checkbox这类列表，如果批量提交和绑定传入后台
        //v-model定义成数组 配合:value属性去使用

        const vm = new Vue({
            el:"#app",
            data:{
                //把v-model 声明成数组
                vals:[],
                arr:["多喝热水","早点睡","那个女孩是我妹","妹妹说紫色真有韵味"]
            },
            methods:{
 
            }
        })
    </script>
</body>
</html>